<template>
  <div class="ek-page">
    <el-tabs v-model="code" class="config-tabs" @tab-click="handleClick">
      
      <el-tab-pane label="微信小程序配置" name="CONFIG_GROUP_WECHAT_MINI">
        <WechatMiniConfig v-if="code == 'CONFIG_GROUP_WECHAT_MINI'" />
      </el-tab-pane>
      <el-tab-pane label="微信服务号配置" name="CONFIG_GROUP_WECHAT">
        <WechatConfig v-if="code == 'CONFIG_GROUP_WECHAT'" />
      </el-tab-pane>
      <el-tab-pane label="微信商户号配置" name="CONFIG_GROUP_WECHAT_MCH">
        <WechatMerchantConfig v-if="code == 'CONFIG_GROUP_WECHAT_MCH'" />
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script setup>
import { defineComponent, onMounted, getCurrentInstance, ref } from "vue";
import ekInput from "@/components/form/ekInput/index.vue";
import ekRadio from "@/components/form/ekRadio/index.vue";
import ekTip from "@/components/business/ekTip/index.vue";
import ekUploadImage from "@/components/form/ekUploadImage/index.vue";
import TransferPay from "./TransferPay.vue";
import WechatMiniConfig from "./WechatMiniConfig.vue";
import WechatConfig from "./WechatConfig.vue";
import WechatMerchantConfig from "./WechatMerchantConfig.vue";
import PrivacyPolicy from "./PrivacyPolicy.vue";
import UserAgreement from "./UserAgreement.vue";
import AboutUs from "./AboutUs.vue";
import WechatMenu from "./WechatMenu.vue";
import Base from "./Base.vue";
import { getDimensionByCode } from "@/utils/sys.js";
 
defineComponent({
  name: "config-index",
});
const {
  appContext: {
    config: { globalProperties },
  },
} = getCurrentInstance();

const { $storage, $http, $ekMessage, $ekMessageBox } = globalProperties;
const code = ref("CONFIG_GROUP_WECHAT_MINI");

const handleClick = (tab, event) => {
  code.value = tab.props.name;
};


</script>
<style scoped lang="scss">
.ek-page {
  background-color: #fff;
  border-radius: 8px;;
  height: auto;
  padding: 0px 0 20px; 
}
.config-tabs {
  padding: 0 10px;
}
</style>
